import type { ExtractPropTypes, PropType } from 'vue';
import type { DataTableColumn, PaginationProps } from 'naive-ui'; // 修正表格列类型
import type { formProps } from '../form/props';
// 显式定义 formConfig 应有的值类型（从 formProps 提取）
type FormConfigType = ExtractPropTypes<typeof formProps>;

interface column {
  align: 'left' | 'right' | 'center';
  title: string;
  key: string;
}

export type TableProps = {
  columns: DataTableColumn<column>[];
  tableTitle?: string;
  data: any[];
  useForm?: boolean;
  formConfig?: FormConfigType;
  pagination?: PaginationProps;
};
const pageSizes = [
  { label: '10 每页', value: 10 },
  { label: '20 每页', value: 20 },
  { label: '30 每页', value: 30 },
  { label: '40 每页', value: 40 }
];

export const tableProps = {
  api: {
    type: Function as PropType<(params: any) => Promise<any>> | undefined,
    default: () => undefined
  },
  // 修正 columns 类型
  columns: {
    type: Array as PropType<DataTableColumn<column>[]>,
    default: () => []
  },
  tableTitle: {
    type: String,
    default: '用户列表'
  },
  data: {
    type: Array as PropType<any[]>,
    default: () => []
  },
  useForm: {
    type: Boolean,
    default: false
  },
  pagination: {
    type: Object as PropType<PaginationProps>,
    default: () => ({
      pageSize: 10,
      page: 1,
      pageCount: 100,
      showSizePicker: true,
      pageSizes,
      // 兼容 itemCount 为 undefined 的情况
      prefix: (info: PaginationProps) => `共 ${info.itemCount ?? 0} 条`
    })
  },
  formConfig: {
    type: Object as PropType<FormConfigType>, // 明确指定为值类型
    default: () => ({
      inline: true, // 默认值应为实际值，而非配置对象
      size: 'medium',
      labelWidth: 80,
      labelPlacement: 'left',
      rules: {},
      modelValue: {},
      formItems: []
    })
  }
};
